<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="/static/js/third/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
    <title>用户资料编辑</title>
</head>

<body>
<h2>用户资料编辑</h2>

<form class="form-horizontal" role="form" id="edit_form">
    <input type="hidden" class="form-control" th:field="${user.id}"/>
    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">呢称:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" th:field="${user.name}"/>
        </div>
<!--        <label for="birthday" class="col-sm-2 control-label">生日:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" name="birthday" th:field="${user.birthday}"/>
        </div>-->
        <label for="email" class="col-sm-2 control-label">EMAIL:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control"  th:field="${user.email}"/>
        </div>
        <label for="qq" class="col-sm-2 control-label">QQ:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" th:field="${user.qq}"/>
        </div>
        <label for="mobile" class="col-sm-2 control-label">手机:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" th:field="${user.mobile}"/>
        </div>
        <label for="qq" class="col-sm-2 control-label">血型:</label>

        <div class="col-sm-10">
            <select name="bloodType" class="form-control">
                <option value="">请选择</option>
                <option th:each="blood:${bloodtype}" th:value="${blood}" th:text="${blood}" th:selected="${blood eq user.bloodType }"></option>
            </select>
        </div>

        <label for="address" class="col-sm-2 control-label">地址:</label>
        <div class="col-sm-10">
            <input type="hidden" class="form-control" th:field="${user.address.id}"/>
            <input type="text" class="form-control" th:field="${user.address.prov}" placeholder="省"/>
            <input type="text" class="form-control" th:field="${user.address.city}" placeholder="市"/>
            <input type="text" class="form-control" th:field="${user.address.dist}" placeholder="区街道"/>
            <input type="text" class="form-control" th:field="${user.address.desc}" placeholder="详细"/>
        </div>

        <div class="col-sm-offset-2 col-sm-10">
            <button type="button" id="edit_btn"  class="btn btn-danger">提交</button>
        </div>
    </div>
</form>
</body>

</html>
<script src="/static/js/third/jquery/jquery-v1.11.js"></script>
<script src="/static/js/third/bootstrap/js/bootstrap.min.js"></script>
<script src="/static/js/third/layer/layer-1.9.3.js"></script>
<script th:inline="javascript">
    $("#edit_btn").on("click", function () {
        editPost();
    });
    function editPost() {
        $.ajax({
            type: "POST",
            url: "/user/edit/post",
            data: $("#edit_form").serialize(),
            dataType: "json",
            success: function (data) {
                layer.closeAll();
                if (data.retCode == 'FAIL') {//失败
                    layer.msg(data.msg, {icon: 2});
                } else {//成功
                    layer.msg(data.msg, {icon: 1});
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                layer.closeAll("loading");
                layer.msg("系统正忙,请稍后再试", {icon: 2}, {shade: [0.5, '#000']});
            }
        });
    }

</script>